import QtQuick 2.15
import QtQuick.Layouts 2.15
import Qt5Compat.GraphicalEffects

Rectangle {
    id:middleCard
    Layout.fillHeight:true
    Layout.fillWidth:true
    radius: 20
    clip:true
    color:cardColor

    layer.enabled: true
    layer.effect: OpacityMask{
        maskSource: Rectangle{
            width: middleCard.width
            height: middleCard.height
            radius: middleCard.radius
        }
    }

    property string title
    property url img

    signal smallCardClickedSig()

    RowLayout {
        anchors.fill: parent
        Rectangle{//左侧区域
            Layout.row: 0
            Layout.fillHeight: true
            Layout.fillWidth: true
            color:"transparent"

            Text {
                text: title
                x:10
                color:textColor
            }
        }
        Rectangle{//右侧区域
            Layout.row: 1
            Layout.fillHeight: true
            Layout.fillWidth: true
            color:"transparent"
            Image {
                source: img
                sourceSize.width: 50
                sourceSize.height: 50
                anchors.bottom: parent.bottom
                anchors.right: parent.right
            }
        }
    }
    MouseArea {
        anchors.fill: parent
        onClicked: {
            smallCardClickedSig()
        }
    }
}
